<script lang="ts" setup>
    import {reactive} from 'vue'
    import { ArrowDown } from '@element-plus/icons-vue'
    //定义图片数组
    let imgList = reactive(['L1.jpg','L2.jpg','L3.jpg'])
</script>
<template>



<div>
  <!-- 希望轮播的组件距离上面的导航的组件空一点 -->
  <el-carousel :interval="4000" arrow="always" height="460px"  style="margin-top: 20px;">
    <el-carousel-item v-for="item in imgList" :key="item">
     <!-- 此处的图片的路径的引入必须要使用:src -->
     <el-image style="width: 1920px;height: 460px;" :src="`src/assets/images/${item}`"></el-image>
    </el-carousel-item>
  </el-carousel>
</div>
</template>

<style scoped>





</style>